<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>演示移动端头部布局</title>
</head>
<style>
     /*全局盒模型 start*/
    * {
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        outline: 0;
        box-sizing: border-box;
        padding:0;
        margin:0;
    }
    /*全局盒模型 end*/
    /*此为解决苹果手机对input按钮编译不一样的问题 start*/
    input[type=button], input[type=submit], input[type=file], button { 
        cursor: pointer; -webkit-appearance: none; 
    } 
    input::-webkit-input-placeholder { /* WebKit browsers */  
        color: #999;  
    }  
    input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */  
        color: #999;  
    }  
    input::-moz-placeholder { /* Mozilla Firefox 19+ */  
        color: #999;  
    }  
    input:-ms-input-placeholder { /* Internet Explorer 10+ */  
        color: #999;  
    }
    /*此为解决苹果手机对input按钮编译不一样的问题 end*/
    body {
        color: #333;
        font-size: 13px;
        background-color: #f5f5f5;
    }
    h1, h2, h3, h4, h5, h6 {
        font-size: 100%;
        font-weight: normal;
        margin: 0;
    }
    .border-b {
        border-bottom: 1px solid #e0e0e0;
    }
    .p-rel {
        position: relative;
    }
    .wx-back, .wx-home {
        background-repeat:no-repeat;
        width:2.5rem;
        height:2.5rem;
        background-size:1.4rem 1.4rem;
        background-position:center center;
    }
    .wx-header {
        line-height: 2.5rem;
        top: 0;
        position: fixed;
        width: 100%;
        z-index: 100;
        left: 0;
        background-color: #71dd50;

    }
    .wx-header .p-rel {
        padding: 0 2.5rem;
    }
    .wx-header .wx-back {
        position:absolute;
        left:0;
        top:0;
    }
    .wx-header .wx-home {
        position:absolute;
        right:0;
        top:0;
    }
    .wx-header h1 {
        text-align:center;
        height: 2.5rem;
        overflow: hidden;

    }
    .wx-back {
        background-image: url('');
    }
    .wx-home {
        background-image: url('');
    }
</style>
<body>
    <header class="wx-header border-b o-header">
        <div class="p-rel">
            <i class="wx-back" onclick="history.go(-1)"></i>
            <h1 class="page-title">会员登录</h1>
            <i class="wx-home imitate-href" data-href="#"></i>
        </div>
    </header>
</body>
</html>